<!DOCTYPE html>
<html lang="zh-Hans">


<head>
    <title>机票查询订购系统</title>
        <!-- meta -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- css -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">

    <!-- js -->
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="http://huangkun123.com/static/admin/js/layui.js"></script>

    <link rel="stylesheet" href="http://huangkun123.com/static/admin/css/layui.css">
</head>
<body>
<div class="container" style="background: #f2f2f2;padding-bottom: 150px;">
    <div class="jumbotron" style="background: #009688;">
        <p style="text-align: center;">机票查询订购系统</p>
        <div class="user_status" style="float: left;">
            <a href="#" >角色：管理员</a>
        </div>
       <div style="float: right;">
            <a href="/user/manager" >首页&nbsp&nbsp</a>
            <a href="/user/admin_z" >添加航班&nbsp&nbsp</a>
            <a href="/user/admin_info" >修改信息&nbsp&nbsp</a>
        <a href="/user/login_out">退出登陆</a>
        </div>

        </div>
<!--    <form action="/user/manager/" method="get">-->
<!--       <div class="layui-inline" style="margin-top:50px">-->
<!--      <div style="margin-left:60px">-->
<!--           <label >出发地点</label>-->
<!--      <div class="layui-input-inline">-->
<!--        <input type="tel" name="start" lay-verify="required|phone" autocomplete="off" class="layui-input" placeholder="输入起始地">-->
<!--      </div>-->
<!--      &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp-->
<!--      <label >目的地点</label>-->
<!--      <div class="layui-input-inline">-->
<!--        <input type="tel" name="arrived" lay-verify="required|phone" autocomplete="off" class="layui-input" placeholder="输入目的地">-->
<!--      </div>-->
<!--      &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp-->
<!--      <label >出发日期</label>-->
<!--      <div class="layui-input-inline">-->
<!--        <input name="time_start" class="layui-input" id="test1" placeholder="选择出发日期">-->
<!--      </div>-->
<!--      &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp-->
<!--      <button type="submit" class="layui-btn layui-btn-normal layui-btn-radius" style="margin-left: 100px;">车票查询</button>-->
<!--      </div>-->

<!--    </div>-->
<!--    </form>-->

    <br>
    <br>
    <br>
    <br>
    <div style="text-align: center;">
      <label style="text-align: center;font-size:20px;margin-bottom: 20px;">飞机航班列表</label>
    </div>

    <table class="table table-bordered" rules=none>
        <thead>
        <tr>
            <th>起发时间</th>
            <th>到达时间</th>
            <th>出发地</th>
            <th>目的地</th>
            <th>航班</th>
            <th>余票</th>
            <th>票价</th>
            <th width="10%">操作</th>
            <th width="5%">编辑</th>
        </tr>
        </thead>
        <tbody>
 {% for ticket in tickets %}
        <tr>
           <td>{{ticket.time_start}}</td>
            <td>{{ticket.time_arrived}}</td>
            <td>{{ticket.start}}</td>
            <td>{{ticket.arrived}}</td>
            <td>{{ticket.num}}</td>
            <td>{{ticket.seats}}</td>
            <td>{{ticket.price}}</td>
            <td>

                <a href="/user/admin_s?order_id={{ticket.id}}">
                    <button type="button" class="layui-btn layui-btn-danger layui-btn-radius" id="delete_btn" style="height:35px;margin:0 auto;">删除</button>

                </a>  </td>
            <td>
             <a href="/user/admin_g?order_id={{ticket.id}}" style="color:blue">
                    编辑

                </a>  </td>
        </tr>
  {% endfor %}
        </tbody>
    </table>









</div>
<script>
    $('#delete_btn').click(function(){
        alert('删除成功！')
    })
</script>
<script>
layui.use('laydate', function(){
  var laydate = layui.laydate;

  //常规用法
  laydate.render({
    elem: '#test1'
  });

  //国际版
  laydate.render({
    elem: '#test1-1'
    ,lang: 'en'
  });

  //年选择器
  laydate.render({
    elem: '#test2'
    ,type: 'year'
  });

  //年月选择器
  laydate.render({
    elem: '#test3'
    ,type: 'month'
  });

  //时间选择器
  laydate.render({
    elem: '#test4'
    ,type: 'time'
  });

  //日期时间选择器
  laydate.render({
    elem: '#test5'
    ,type: 'datetime'
  });

  //日期范围
  laydate.render({
    elem: '#test6'
    ,range: true
  });

  //年范围
  laydate.render({
    elem: '#test7'
    ,type: 'year'
    ,range: true
  });

  //年月范围
  laydate.render({
    elem: '#test8'
    ,type: 'month'
    ,range: true
  });

  //时间范围
  laydate.render({
    elem: '#test9'
    ,type: 'time'
    ,range: true
  });

  //日期时间范围
  laydate.render({
    elem: '#test10'
    ,type: 'datetime'
    ,range: true
  });

  //自定义格式
  laydate.render({
    elem: '#test11'
    ,format: 'yyyy年MM月dd日'
  });
  laydate.render({
    elem: '#test12'
    ,format: 'dd/MM/yyyy'
  });
  laydate.render({
    elem: '#test13'
    ,format: 'yyyyMMdd'
  });
  laydate.render({
    elem: '#test14'
    ,type: 'time'
    ,format: 'H点m分'
  });
  laydate.render({
    elem: '#test15'
    ,type: 'month'
    ,range: '~'
    ,format: 'yyyy-MM'
  });
  laydate.render({
    elem: '#test16'
    ,type: 'datetime'
    ,range: '到'
    ,format: 'yyyy年M月d日H时m分s秒'
  });

  //开启公历节日
  laydate.render({
    elem: '#test17'
    ,calendar: true
  });

  //自定义重要日
  laydate.render({
    elem: '#test18'
    ,mark: {
      '0-10-14': '生日'
      ,'0-12-31': '跨年' //每年的日期
      ,'0-0-10': '工资' //每月某天
      ,'0-0-15': '月中'
      ,'2017-8-15': '' //如果为空字符，则默认显示数字+徽章
      ,'2099-10-14': '呵呵'
    }
    ,done: function(value, date){
      if(date.year === 2017 && date.month === 8 && date.date === 15){ //点击2017年8月15日，弹出提示语
        layer.msg('这一天是：中国人民抗日战争胜利72周年');
      }
    }
  });

  //限定可选日期
  var ins22 = laydate.render({
    elem: '#test-limit1'
    ,min: '2016-10-14'
    ,max: '2080-10-14'
    ,ready: function(){
      ins22.hint('日期可选值设定在 <br> 2016-10-14 到 2080-10-14');
    }
  });

  //前后若干天可选，这里以7天为例
  laydate.render({
    elem: '#test-limit2'
    ,min: -7
    ,max: 7
  });

  //限定可选时间
  laydate.render({
    elem: '#test-limit3'
    ,type: 'time'
    ,min: '09:30:00'
    ,max: '17:30:00'
    ,btns: ['clear', 'confirm']
  });

  //同时绑定多个
  lay('.test-item').each(function(){
    laydate.render({
      elem: this
      ,trigger: 'click'
    });
  });

  //初始赋值
  laydate.render({
    elem: '#test19'
    ,value: '1989-10-14'
    ,isInitValue: true
  });

  //选中后的回调
  laydate.render({
    elem: '#test20'
    ,done: function(value, date){
      layer.alert('你选择的日期是：' + value + '<br>获得的对象是' + JSON.stringify(date));
    }
  });

  //日期切换的回调
  laydate.render({
    elem: '#test21'
    ,change: function(value, date){
      layer.msg('你选择的日期是：' + value + '<br><br>获得的对象是' + JSON.stringify(date));
    }
  });
  //不出现底部栏
  laydate.render({
    elem: '#test22'
    ,showBottom: false
  });

  //只出现确定按钮
  laydate.render({
    elem: '#test23'
    ,btns: ['confirm']
  });

  //自定义事件
  laydate.render({
    elem: '#test24'
    ,trigger: 'mousedown'
  });

  //点我触发
  laydate.render({
    elem: '#test25'
    ,eventElem: '#test25-1'
    ,trigger: 'click'
  });

  //双击我触发
  lay('#test26-1').on('dblclick', function(){
    laydate.render({
      elem: '#test26'
      ,show: true
      ,closeStop: '#test26-1'
    });
  });

  //日期只读
  laydate.render({
    elem: '#test27'
    ,trigger: 'click'
  });

  //非input元素
  laydate.render({
    elem: '#test28'
  });

  //墨绿主题
  laydate.render({
    elem: '#test29'
    ,theme: 'molv'
  });

  //自定义颜色
  laydate.render({
    elem: '#test30'
    ,theme: '#393D49'
  });

  //格子主题
  laydate.render({
    elem: '#test31'
    ,theme: 'grid'
  });


  //直接嵌套显示
  laydate.render({
    elem: '#test-n1'
    ,position: 'static'
  });
  laydate.render({
    elem: '#test-n2'
    ,position: 'static'
    ,lang: 'en'
  });
  laydate.render({
    elem: '#test-n3'
    ,type: 'month'
    ,position: 'static'
  });
  laydate.render({
    elem: '#test-n4'
    ,type: 'time'
    ,position: 'static'
  });
});
</script>
</body>
</html>